<script setup lang="tsx">
import { NTag, NButton} from 'naive-ui';
import { fetchCheckBatch } from '@/service/api';
import { $t } from '@/locales';
import { useAppStore } from '@/store/modules/app';
import { batchStatusRecord } from '@/constants/business';
import { useTable, useTableOperate } from '@/hooks/common/table';
import { useRouterPush } from '@/hooks/common/router';

// 路由
const { routerPushByKey } = useRouterPush();


const appStore = useAppStore();

const tagMap: Record<Api.SystemManage.BatchStatus, NaiveUI.ThemeColor> = {
  '0111': 'primary',
  '0112': 'primary',
  '012': 'warning',
  '013': 'warning',
  '02': 'success',
  '03': 'error'
};
const {
  columns,
  columnChecks,
  data,
  getData,
  getDataByPage,
  loading,
  mobilePagination,
} = useTable({
  immediate: undefined,
  apiFn: fetchCheckBatch,
  showTotal: true,
  apiParams: {
    current: 1,
    size: 10,
    name: null,
    status: null,
  },
  columns: () => [
    {
      key: 'index',
      title: $t('common.index'),
      align: 'center',
      width: 64
    },
    {
      key: 'id',
      title: $t('page.batch.id'),
      align: 'center'
    },
    {
      key: 'name',
      title: $t('page.batch.name'),
      align: 'center'
    },
    {
      key: 'startTime',
      title: $t('page.batch.startTime'),
      align: 'center',
    },
    {
      key: 'endTime',
      title: $t('page.batch.endTime'),
      align: 'center'
    },
    {
      key: 'status',
      title: $t('page.batch.status'),
      align: 'center',
      render: row => {
        if(row.status === null){
          return null;
        }

        const label = $t(batchStatusRecord[row.status]);
        return <NTag type={tagMap[row.status]}>{label}</NTag>;
      }
    },
    {
      key: 'operate',
      title: $t('common.operate'),
      align: 'center',
      width: 130,
      render: row => {
        if(row.status === null){
          return;
        }

        // 根据batchStatus
        // 0111 待考核
        // 0112 在考核
        // 012 待总评
        // 013 待归档
        // 02 已完成
        // 03 已取消
        if(row.status === "0111"){
          return (
          <NButton type="primary" size="small" onClick={() => handleEnterScore(row)}>
            进入打分
          </NButton>
        );
        }else if(row.status === "0112"){
          return (
          <NButton type="primary" size="small" onClick={() => handleEnterScore(row)}>
            继续打分
          </NButton>
        );
        }

      }
    }
  ]
});

const {
  drawerVisible,
  operateType,
  editingData,
  handleAdd,
  handleEdit,
  checkedRowKeys,
  onBatchDeleted,
  onDeleted
  // closeDrawer
} = useTableOperate(data, getData);

// 示例事件处理函数
function handleEnterScore(row: any) {
  routerPushByKey('checkcategory', { params: { id: row.id } })
    .then(() => {
      console.log('成功跳转到打分界面');
    })
    .catch(error => {
      console.error('跳转失败:', error);
    });
}
</script>

<template>
  <div class="min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
    <NCard :title="$t('page.batch.title')" :bordered="false" size="small" class="sm:flex-1-hidden card-wrapper">
      <NDataTable
        v-model:checked-row-keys="checkedRowKeys"
        :columns="columns"
        :data="data"
        size="small"
        :flex-height="!appStore.isMobile"
        :scroll-x="962"
        :loading="loading"
        remote
        :row-key="row => row.id"
        :pagination="mobilePagination"
        class="sm:h-full"
      />
    </NCard>
  </div>
</template>

<style scoped></style>
